<template>
  <div>
    <canvas ref="qrCanvas"></canvas>
  </div>
</template>

<script>
import QRCode from 'qrcode'

export default {
  props: {
    text: {
      type: String,
      required: true
    }
  },
  mounted() {
    this.generateQRCode()
  },
  methods: {
    generateQRCode() {
      const canvas = this.$refs.qrCanvas
      QRCode.toCanvas(canvas, this.text, error => {
        if (error) console.error(error)
      })
    }
  }
}
</script>
